<template>
  <div>
    <h2><span id="gun">丨</span> 门店设置</h2>
    <div id="one" class="clear">
      <p>登录账号</p>
      <p>{{$store.state.routers.userInfo.number}}</p>
    </div>
    <div id="two" class="clear">
      <p>收款信息<i @click="changeMoney" class="el-icon-edit"></i></p>
      <div id="two-left">
        <p>银行开户公司名</p>
        <p>银行开户账号</p>
        <p>开户银行所在地</p>
        <p>开户银行</p>
      </div>
      <div id="two-right">
        <p>{{firmData.name}}</p>
        <p>{{firmData.bankAccount}}</p>
        <p>{{firmData.bankLocation}}</p>
        <p>{{firmData.bank}}</p>
      </div>
      <!-- <p>银行开户公司名 <span>xxxx有限公司</span></p>
      <p>银行开户账号 <span>6228 1234 4321 1234 1234</span></p>
      <p>开户银行所在地 <span>陕西西安</span></p>
      <p>开户银行 <span></span></p> -->
    </div>
    <div id="three" class="clear">
      <p>
        企业信息修改需要审核才能生效
        <i @click="changeEnterprise" class="el-icon-edit"></i>
      </p>
      <div id="three-son clear">
        <p class="clear">
          <span class="three-left">企业名称</span
          ><span class="three-rihgt">{{firmData.name}}</span>
        </p>
        <p class="clear">
          <span class="three-left">注册地址</span
          ><span class="three-rihgt">{{firmData.location}}</span>
        </p>
        <p class="clear">
          <span class="three-left three-left-fl1">企业简介</span
          ><span class="three-rihgt three-rihgt-fl1">{{firmData.des}}</span>
        </p>
        <p class="clear">
          <span class="three-left">客服电话</span
          ><span class="three-rihgt">{{firmData.serviceNumber}}</span>
        </p>
        <p class="clear">
          <span class="three-left">负责人姓名</span
          ><span class="three-rihgt">{{firmData.boss}}</span>
        </p>
        <p class="clear">
          <span class="three-left">负责人电话</span
          ><span class="three-rihgt">{{firmData.bossNumber}}</span>
        </p>
        <div class="clear">
          <p class="three-left three-left-fl1">营业执照</p>
            <div class="demo-image__preview three-rihgt three-rihgt-fl1">
              <el-image 
                style="width: 100px; height: 100px"
                :src="url + '/' + this.firmData.license" 
                :preview-src-list="[url + this.firmData.license]">
              </el-image>
            </div>
        </div>
        <div class="clear">
          <p class="three-left three-left-fl1">门头照片</p>
          <div class="demo-image__preview three-rihgt three-rihgt-fl1">
              <el-image 
                style="width: 100px; height: 100px"
                :src="url + '/' + this.firmData.photo" 
                :preview-src-list="[url + this.firmData.photo]">
              </el-image>
            </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'storeset',
  data() {
    return {
      postbox:'',
      firmData:[],
      Httphead:'http://172.16.113.187:8080',
      url: 'http://172.16.113.187:8080',
      // srcList: [
      //   'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
      //   'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg'
      // ],
    }
  },
  created() {
    this.getFirm()
    // console.log(this.firmData);
  },
  methods: {
    //查询登录者门店信息数据
    getFirm() {
      this.$axios({
        url: this.Httphead + '/setting/detailsQuery',
        method: 'get',
        params:{
          postbox:this.$store.state.routers.userInfo.number
        }
      }).then((res) => {
          console.log('获取信息', res)
          if (res.code === 200) {
            this.firmData = res.data[0];
            // sessionStorage.setItem('login',String(this.firmData))
            // console.log(this.firmData);
          } else {
            this.$message({
              message: '服务器出错了',
              type: 'error',
            })
          }
        }).catch((err) => {
          console.log('获取失败', err)
        })
    },
    changeMoney() {
      // this.$router.push({ name: 'changemoney' },)
      // this.$router.push('changemoney');
      this.$router.push({ name: "changemoney", params: {
        name:this.firmData.name,
        bankAccount:this.firmData.bankAccount,
        bankLocation:this.firmData.bankLocation,
        bank:this.firmData.bank
      } });
      // sessionStorage.setItem('login',this.firmData)
    },
    changeEnterprise() {
      this.$router.push({name:'changeenterprise',params:{
        firmData:this.firmData
      }
      })
    },
  },
  mounted() {},
  computed: {},
  watch: {},
}
</script>

<style scoped>
* {
  margin: 0;
  padding: 0;
}
#one {
  width: 100%;
  /* height: 50px; */
  margin-top: 30px;
  /* border: 1px solid red; */
}
#one > p:nth-of-type(1) {
  width: 20%;
  float: left;
  /* border: 1px solid red; */
}
#one > p:nth-of-type(2) {
  width: 80%;
  float: right;
  /* border: 1px solid red; */
}

#two {
  width: 100%;
  /* height: 300px; */
  /* border: 1px solid red; */
  margin-top: 50px;
}
.clear::after {
  content: '';
  display: block;
  clear: both;
}
#two > p:nth-of-type(1) {
  color: #d0d0d0;
  margin-bottom: 20px;
}
#two > p:nth-of-type(1) > i {
  color: #8a8a8a;
  margin-left: 20px;
}
#two-left {
  width: 20%;
  float: left;
}
#two-left > p {
  margin: 10px 0;
}
#two-right {
  width: 80%;
  float: right;
}
#two-right > p {
  margin: 10px 0;
}

#three {
  width: 100%;
  margin-top: 50px;
}
#three > p:nth-of-type(1) {
  color: #d0d0d0;
  margin-bottom: 30px;
}
#three > p:nth-of-type(1) > i {
  color: #8a8a8a;
  margin-left: 20px;
}
.three-left {
  width: 20%;
  display: inline-block;
  margin: 10px 0;
}
.three-rihgt {
  width: 80%;
  display: inline-block;
  margin: 10px 0;
}
.three-left-fl1 {
  float: left;
}
.three-rihgt-fl1 {
  float: right;
}

img {
  width: 50px;
  height: 50px;
  background-color: red;
}
#gun {
  color: #0082cc;
}

</style>
